<template>
	<view>
		<uni-nav-bar  left-icon="left"  :statusBar="true" titleSize="30px" leftText="返回"   title="详情"  @clickLeft="back"  :fixed="true" backgroundColor="#3286ed" color="#fff"/>
	    <view class="details">
			<view class="title">入库编号:{{infomation.warehousingNo}}</view>
			<view class="desc">入库时间:{{infomation.warehousingTime}}</view>
			<view class="desc">业务员:{{infomation.chargePersonName}}</view>
		</view>
		<u-tabs class="tabNav orderdetails" :current="index" style='margin-top: 10px;' @change="changeFn" lineWidth="104rpx" lineColor="#fd9540" :activeStyle="{ color:'#fd9540',fontWeight:'bold' }" :list="tabTitle"></u-tabs>

		 <view>
			 <view v-if="index==0" style="background-color: #fff;">
				 <u-cell >
					 <template #title>
						 <view style="font-size: 12px;">基本信息</view>
					 </template>
				 </u-cell>
				 <u-cell >
				 	<view slot="title"  >
				 		<text class="u-cell-text" >入库编号</text>
				 		<text class="u-cell-text" style="margin-left: 10px;">{{infomation.warehousingNo}}</text>
				 	</view>
				 </u-cell>
				 <u-cell >
				 	<view slot="title"  >
				 		<text class="u-cell-text" >入库时间</text>
				 		<text class="u-cell-text" style="margin-left: 10px;">{{infomation.warehousingTime}}</text>
				 	</view>
				 </u-cell>
				 <u-cell >
				 	<view slot="title"  >
				 		<text class="u-cell-text" >入库仓库</text>
				 		<text class="u-cell-text" style="margin-left: 10px;">{{infomation.warehousingWarehouseName}}</text>
				 	</view>
				 </u-cell>
				 <u-cell >
				 	<view slot="title"  >
				 		<text class="u-cell-text" >业务类型</text>
				 		<text class="u-cell-text" style="margin-left: 10px;">{{businssType}}</text>
				 	</view>
				 </u-cell>
				 <u-cell >
				 	<view slot="title"  >
				 		<text class="u-cell-text" >入库类型</text>
				 		<text class="u-cell-text" style="margin-left: 10px;">{{infomation.receiptType}}</text>
				 	</view>
				 </u-cell>
				 <u-cell >
				 	<view slot="title"  >
				 		<text class="u-cell-text" >订单状态</text>
				 		<text class="u-cell-text" style="margin-left: 10px;">{{orderStatusType}}</text>
				 	</view>
				 </u-cell>
				 <u-cell >
				 	<view slot="title"  >
				 		<text class="u-cell-text" >责任人</text>
				 		<text class="u-cell-text" style="margin-left: 10px;">{{infomation.chargePersonName}}</text>
				 	</view>
				 </u-cell>
				 <u-cell >
				 	<view slot="title"  >
				 		<text class="u-cell-text" >备注</text>
				 		<text class="u-cell-text" style="margin-left: 10px;">{{infomation.remark}}</text>
				 	</view>
				 </u-cell>
			 </view>
			 <view v-if="index==1">
				 <u-cell >
					 <template #title>
						 <view style="font-size: 12px;">关联产品</view>
					 </template>
				 </u-cell>
				 <view>
					 <uni-table border stripe emptyText="暂无更多数据" >
					 	<!-- 表头行 -->
					 	<uni-tr>
					 		<uni-th align="center">产品名称</uni-th>
					 		<uni-th align="center">型号</uni-th>
					 		<uni-th align="center">单位</uni-th>
					 		<uni-th align="center">仓库</uni-th>
					 		<uni-th align="center">入库数量</uni-th>
					 		<uni-th align="center">备注</uni-th>
					 	</uni-tr>
					 	<!-- 表格数据行 -->
					 	<uni-tr v-for="(item,index) in productList" :key="index">
					 		<uni-td align="center">{{item.productName}}</uni-td>
					 		<uni-td align="center">{{item.model}}</uni-td>
					 		<uni-td align="center">{{item.unit}}</uni-td>
					 		<uni-td align="center">{{item.warehousingWarehouseName}}</uni-td>
					 		<uni-td align="center">{{item.receiptQuantity}}</uni-td>
					 		<uni-td align="center">{{item.remark}}</uni-td>
					 	</uni-tr>
					 </uni-table>
				 </view>
			 </view>
		 </view>
	</view>
</template>

<script>
	import {getDicts} from '@/api/dictionary/index.js'
	export default {
		data(){
			return {
				index:0,
				tabTitle:[
					{name:'基本信息'},
					{name:'关联产品'}
				],
				infomation:{},
				businssType:'',
				businssTypeOptions:[],
				productList:[],
			    orderStatusType:'',//订单状态 已入库
				returnStatusOption:[],
			}
		},
		onLoad(option){
			console.log(option);
		    this.infomation = JSON.parse(decodeURIComponent(option.item))
			console.log( this.infomation);
			this.productList=this.infomation.productList
			this.getBusiness()
			this.getReturnStatus()
			
			
		},
		methods:{
			back(){},
			// 入库类型
			getBusiness(){
				getDicts('biz_business_type').then(response=>{
					console.log(response);
					this.businssTypeOptions=response.data
					this.businssType=this.getValue(this.businssTypeOptions,this.infomation.businessType)
				})
			},
			// 入库订单出入库biz_receipt_type
			getReturnStatus(){
				getDicts('return_status').then(res=>{
					this.returnStatusOption=res.data
					this.orderStatusType=this.getValue(this.returnStatusOption,this.infomation.orderStatus)
				})
			},
			getValue(arr,item){
				for(var i=0;i<arr.length;i++){
					if(item==arr[i].dictValue){
						return arr[i].dictLabel
					}
				}
			},
			changeFn(e){
				console.log(e);
				this.index=e.index
			}
		}
	}
</script>

<style lang="scss">
	.details{
	  background-color: #fff;
	  padding: 10px;
	  border: solid 1px #c3c3c3;
	  .title{
		  font-size: 14px;
		  font-weight: 600;
	  }
	  .desc{
		  font-size: 12px;
		  margin-top: 3px;
		  
	  }
	}
	.orderdetails{
		background-color: #fff;
	}
</style>